<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>教师页面</title>
	<link rel="stylesheet" type="text/css" href="../css/course.css">
	<link rel="stylesheet" type="text/css" href="../css/teacher.css">
	<link rel="stylesheet" type="text/css" href="../css/reset.css">
	<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_8h2fgrztz6e9izfr.css">
</head>
<body> 
	<!-- 顶部 -->
	<div class="c-top">
		<!-- logo -->
		<div class="logo">
			<a href="course-index.html"><img src="../image/logo.jpg"></a>
		</div>
		<!-- top导航 -->
		<div class="topNav-box">
			<ul>
				<li><a href="course-index.html" class="f-01">课程</a><div class="current"></div></li>
				<li><a href="" class="f-01">学校</a><div class=""></div></li>
				<li><a href="" class="f-01">文章</a><div class=""></div></li>
			</ul>
		</div>
		<!-- 搜索框 -->
		<div class="search-box">
			<form class="search-wrap">
				<input class="search-input" type="text" name="search-input" placeholder="搜索教程"></input>
				<input class="search-submit" type="submit" value=""></input>
			</form>
		</div>
		<!-- 登陆按钮 -->
		<div class="unlogin-box">
				<a href="login.html" class="f-01 lognin-btn">登录 &nbsp;&nbsp;</a>|<a href="register.html" class="f-01 resiger-btn">&nbsp;&nbsp; 注册</a>
		</div>
		<!-- 用户信息 -->
		<div class="login-box">
			<img src="../image/user/04.jpg" alt="" class="user-img">
			<div class="user-operation">
				<a href="" class="f-01">个人中心</a>
				<a href="" class="f-01">退出登录</a>
			</div>
		</div>
	</div>
	<!-- 主体 -->
	<div class="container">
		<!-- 教师信息 -->
		<div class="t-info-box">
			<div class="t-info">
				<img class="t-img" src="../image/teacher/T-02.jpg"></img>
				<a href="" class="t-blur f-01">+&nbsp;关注</a>
				<ul class="info f-02">
					<li class="i-1"><span class="t-name">韩梅梅</span><a href="" class="t-school f-01">国防科技大学</a>-&nbsp;<span>小学英语故事主角担当</span></li>
					<li class="i-2">关注<span>0</span>人&nbsp;|&nbsp;粉丝<span>998</span>人</li>
					<li class="i-3"><p>陈菁，国防科学技术大学人文与社会科学学院语言文化研究所文化与传播研究室副主任、讲师。近年来，在教学方面，先后讲授过研究生《英语阅读与提高》、《国际会议交流英语》，工程硕士《英语阅读与提高》、《军事英语》，本科生《大学英语听说》、《大学英语读写》和《英语应用写作》等课程。2008年在中南大学为诺贝尔经济学奖得主托马斯§谢林先生的演讲担任即席口译</p></li>
				</ul>
			</div>
			<!-- 遮盖层 -->
			<div class="cover"></div>
			<div class="sc-img">
				<img src="../image/school/SC-01.png">
			</div>
		</div>
		<!-- 主讲课程 -->
		<div class="course-list">
			<div class="c-title"><span>主讲课程</span></div>
			<div class="c-l-box">	
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="course-box">
					<div class="c-img">
						<img src="../image/course/c-img.jpg" class="pic">
					</div>
					<div class="c-1">大学英语（口语）</div>
					<div class="c-2"><a href="" class="c-sc f-01">国防科技大学</a><span class="c-num"><i class="iconfont mooc-xuegongduiwuguanli"></i>12306</span></div>
				</div>
				<div class="clear"></div>
			</div>
		</div>
	</div>
	<!-- 底部 -->
	<div class="clear"></div>
	<div class="c-footer">MOOC</div>
	
<script src="../js/jquery.min.js"></script>
<script>
//用户操作框隐藏|显示
$(function(){
	$('.login-box').hover(function(){
		$(this).css('background-color','#242528');
		$('.user-operation').css('display','block');
	},function(){
		$(this).css('background-color','#2E323E');
		$('.user-operation').css('display','none');
	});
});
// img放大特效
$(function(){
	$w = $('.pic').width();
	$h = $('.pic').height();
	$w2 = $w + 10;
	$h2 = $h + 10;

	$('.course-box').hover(function(){
		 $(this).find('.pic').stop().animate({height:$h2,width:$w2,left:"-10px",top:"-10px"},500);
	},function(){
		 $(this).find('.pic').stop().animate({height:$h,width:$w,left:"0px",top:"0px"},500);
	});
});

</script>
</body>
</html>